﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title> 朱雪松的个人主页</title>
    <style>
        * {
            box-sizing: border-box;
        }
        
        body {
            margin: 0;
        }
        
        .clear {
            clear: both;
        }
        
        .button {
            background-color: #4CAF50;
            /* Green */
            border: none;
            color: white;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
        }
        
        .button2 {
            background-color: #008CBA;
        }
        /* Blue */
        
        .button3 {
            background-color: #f44336;
        }
        /* Red */
        
        .button4 {
            background-color: #e7e7e7;
            color: black;
        }
        /* Gray */
        
        .button5 {
            background-color: #555555;
        }
        /* Black */
        
        .header {
            color: white;
            height: 100%;
            text-align: center;
            padding: 25px;
            margin: auto;
            width: 100%;
        }
        
        .headtop {
            float: none;
            width: 110px;
            height: 20px;
            background-color: aliceblue;
        }
        
        .headerleft {
            float: left;
            width: 300px;
            height: auto;
            display: block;
            background-color: gray;
        }
        
        .headermiddle {
            float: left;
            width: 500px;
            height: auto;
            background-color: gray;
        }
        
        .headerright {
            float: left;
            width: 300px;
            background-color: gray;
        }
        
        .footer {
            background-color: #444;
            color: white;
            padding: 15px;
            width: 100%;
            position: fixed;
            bottom: 0;
        }
        
        .centre {
            text-align: center;
            background-color: white;
            padding: 10px;
            height: 100px;
            float: right;
        }
        
        .topmenu {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: #777;
        }
        
        .topmenu li {
            float: left;
        }
        
        .topmenu li a {
            display: inline-block;
            color: white;
            text-align: center;
            padding: 16px;
            text-decoration: none;
        }
        
        .topmenu li a:hover {
            background-color: #1157ae;
            border: 1px solid #555555;
        }
        
        .topmenu li a.active {
            /*      color: white;*/
            background-color: #1157ae;
            border: 1px solid #555555;
        }
        
        .column {
            text-align: center;
            padding: 15px;
        }
        
        .clearfix::after {
            content: "";
            clear: both;
            display: table;
        }
    </style>
</head>

<body>
    <script type="text/javascript" src="me.js"></script>
    <ul class="topmenu">
        <li><a href="index.html" class="active">首页</a></li>
        <li><a href="life.html">生活记录</a></li>
        <li><a href="me.html">关于我</a></li>
    </ul>
    <div class="clearfix">
        <div class="column">
            <img style="max-width: 100wh; max-height: 80vh;" src="images/me.jpg">
        </div>
    </div>
    <h3 style="color:#000;text-align:center;margin-top:5px;">朱雪松-19090111842-南京大学网络教育学院</h3>
</body>

</html>